
 /**
 * @author 愚人码头
 * tipBox
 * 更多http://www.css88.com/archives/3605
 */
;(function($){
    if ($.fn.tipBox) {
        return;
    }
    //<div class="SD-tipbox"><div class="cntBox"><p>可以同步设置展示<br />我的空间内容了~</p></div><div class="SD-tipbox-direction SD-tipbox-up"><em>&#9670;</em><span>&#9670;</span></div><div class="SD-tipbox-direction SD-tipbox-down"><em>&#9670;</em><span>&#9670;</span></div><div class="SD-tipbox-direction SD-tipbox-left"><em>&#9670;</em><span>&#9670;</span></div><div class="SD-tipbox-direction SD-tipbox-right"><em>&#9670;</em><span>&#9670;</span></div><a title="关闭" onclick="return false" class="close-ico" href="#">关闭</a></div>
    $.tipBox=function(el,options){
        this.options=$.extend({},this.deflunt,options);
        this.ready = false;
        this.$el=$(el);//对象元素
        this.ready = false;
        this.delaytimer = null;
        this.$el.data("tipBox", this.options.actObj);
        this.init();

    };
    $.tipBox.prototype = {
        init:function(){
            //console.log(this.$el.data("tipBox").click);

                this.setPos(this.$el);


            //this.options.actObj.unbind("click");
            //this.options.actObj.bind(this.$el.data("tipBox").click);
        },
        readify:function(){
            this.ready = true;
            this.$el.data("showTag", true);
            var that=this;

                if(this.options.id&&$("#"+this.options.id)[0]){
                    this.$tipBox=$("#"+this.options.id).show();
                    return;
                }else{
                    this.$tipBox=$("<div></div>",{
                        "class":this.options.boxClass,
                        "id":this.options.id,
                        "html":function(){
                            if(that.options.boxClass=="SODAO-tips"){
                                return '<div class="SD-tips-content"><div class="cntBox"></div></div>';
                            } else if(that.options.boxClass=="SD-tipsBox"){
                                return '<div class="SD-tips-content"><div class="cntBox"></div></div>';
                            }
                            else{
                                return '<table  border="0" cellpadding="0" cellspacing="0" class="SD-logLayer"><tbody><tr><td class="top_l"></td><td class="top_c"></td><td class="top_r"></td></tr><tr><td class="mid_l"></td><td class="mid_c"><div class="SD-tips-content"><div class="cntBox"></div></div></td><td class="mid_r"></td></tr><tr><td class="bottom_l"></td><td class="bottom_c"></td><td class="bottom_r"></td></tr></tbody></table>';
                            }
                        }

                    });
                }


            this.$tipBoxCont=this.$tipBox.find(".SD-tips-content");
            if(this.options.width){
                this.$tipBoxCont.css("width",this.options.width);
            }
            if(this.options.height){
                this.$tipBoxCont.css("height",this.options.height);
            }
            if(this.options.title){
                var titleBar = $("<div class='title-bar'></div>").html("<h3>" + this.options.title + "</h3>");
                this.$tipBoxCont.prepend(titleBar)
            }
            if(this.options.closeable){
                var closeBtn = $('<a title="关闭" class="close-ico" href="#">关闭</a>")');
                this.$tipBoxCont.css("padding-right","25px").append(closeBtn);
                this.closeTipBox(this.$tipBox);

            }
            if(this.options.directing){
                var directing =$('<div class="SD-tips-direction"><em>&#9670;</em><span>&#9670;</span></div>');
                this.$tipBoxCont.addClass("SD-tips-"+this.options.direction);
                directing.css(this.options.directing);//设置箭头样式
                this.$tipBoxCont.prepend(directing);
            }
            if (typeof this.options.content === 'function') {
                this.options.content(this.$tipBox);
            }else{
                this.$tipBox.find(".cntBox").html(this.options.content);
            }

            this.$tipBox.appendTo("body").hide();

        },
        setPos:function($tipBoxObj){
            if (this.ready===false) {
                this.readify();
            }
            var $tipBoxObjT=parseInt($tipBoxObj.offset().top);
            var $tipBoxObjL=parseInt($tipBoxObj.offset().left);
            var $tipBoxObjW=$tipBoxObj.width();
            var $tipBoxObjH=$tipBoxObj.height();
            var $tipBoxOutW=this.$tipBox.outerWidth(true);
            var $tipBoxOutH=this.$tipBox.outerHeight(true);
            var $tipBoxT,$tipBoxL,$tipBoxOffsetT,$tipBoxOffsetL;
            switch(this.options.direction){
                case "top":
                    $tipBoxOffsetT=$tipBoxObjT-$tipBoxOutH-this.options.offset;
                    $tipBoxT=$tipBoxObjT-$tipBoxOutH;
                    $tipBoxL=$tipBoxObjL;
                    break;
                case "down":
                    $tipBoxOffsetT=$tipBoxObjT+$tipBoxObjH+this.options.offset;
                    $tipBoxT=$tipBoxObjT+$tipBoxObjH;
                    $tipBoxL=$tipBoxObjL;
                    break;
                case "left":
                    $tipBoxT=$tipBoxObjT;
                    $tipBoxL=$tipBoxObjL-$tipBoxOutW;
                    $tipBoxOffsetL=$tipBoxObjL-$tipBoxOutW-this.options.offset;
                    break;
                case "right":
                    $tipBoxT=$tipBoxObjT;
                    $tipBoxL=$tipBoxObjL+$tipBoxObjW;
                    $tipBoxOffsetL=$tipBoxObjL-$tipBoxObjW+this.options.offset;
                    break;
                default:
                    $tipBoxT=$tipBoxObjT-$tipBoxOutH;
                    $tipBoxL=$tipBoxObjL;
            }
            if(this.options.offset!==0){
                if(this.options.direction=="top" ||this.options.direction=="down" ){
                    this.$tipBox.css({
                        "top":$tipBoxOffsetT,
                        "left":$tipBoxL
                    });
                }else{
                    this.$tipBox.css({
                        "top":$tipBoxT,
                        "left":$tipBoxOffsetL
                    });
                }

                this.$tipBox.show().animate({
                    "top":$tipBoxT,
                    "left":$tipBoxL
                },200).show();
            }else{
                this.$tipBox.show().css({
                    "top":$tipBoxT,
                    "left":$tipBoxL
                }).show();
            }
            if(this.options.closeDelay>0){
                this.delayClose($tipBoxObj);
            }
            if(this.options.mouseOverDelay){
                this.mousedelayClose($tipBoxObj);
            }
            if(this.options.zIndex){
                this.$tipBox.css("zIndex",this.options.zIndex);
            }
            if (typeof this.options.callBack === 'function') {
                this.options.callBack(this.$tipBox);
            }

        },
        mousedelayClose:function($tipBoxObj){
            var that=this;
            var delayFun=function(){
                //that.$tipBox.remove();
                //console.log(that.options.direction);
                if(that.options.direction=="top"){
                    that.$tipBox.animate({
                        "top":"-="+that.options.offset
                    },200,function(){
                        that.$tipBox.hide().remove()
                    });
                }else if(that.options.direction=="down"){
                    that.$tipBox.animate({
                        "top":"+="+that.options.offset
                    },200,function(){
                        that.$tipBox.hide().remove()
                    });
                }else if(that.options.direction=="left"){
                    that.$tipBox.animate({
                        "left":"-="+that.options.offset
                    },200,function(){
                        that.$tipBox.hide().remove()
                    });

                }else{
                    that.$tipBox.animate({
                        "left":"+="+that.options.offset
                    },200,function(){
                        that.$tipBox.hide().remove()
                    });
                }
            };
            this.$tipBox.mouseover(function(){
                window.clearTimeout(that.delaytimer1);
                that.delaytimer1 = null;
            }).mouseout(function(){
                that.delaytimer1=window.setTimeout(delayFun,500);
            });
            this.$el.mouseover(function(){
                window.clearTimeout(that.delaytimer1);
                that.delaytimer1 = null;
            }).mouseout(function(){
                that.delaytimer1=window.setTimeout(delayFun,500);
            });
        },
        delayClose:function($tipBoxObj){
            var that=this;
            var delayFun=function(){
                //that.$tipBox.remove();
                //console.log(that.options.direction);
                if(that.options.direction=="top"){
                    that.$tipBox.animate({
                        "top":"-="+that.options.offset
                    },200,function(){
                        that.$tipBox.hide().remove()
                    });
                }else if(that.options.direction=="down"){
                    that.$tipBox.animate({
                        "top":"+="+that.options.offset
                    },200,function(){
                        that.$tipBox.hide().remove()
                    });
                }else if(that.options.direction=="left"){
                    that.$tipBox.animate({
                        "left":"-="+that.options.offset
                    },200,function(){
                        that.$tipBox.hide().remove()
                    });

                }else{
                    that.$tipBox.animate({
                        "left":"+="+that.options.offset
                    },200,function(){
                        that.$tipBox.hide().remove()
                    });
                }
            };
            if(this.options.closeDelay>0){

                this.delaytimer=window.setTimeout(delayFun,this.options.closeDelay);
            }
            //console.log($(this.options.objevent.target)==this.$el);
            this.$tipBox.mouseover(function(){
                window.clearTimeout(that.delaytimer);
                that.delaytimer = null;
            }).mouseout(function(){
                that.delaytimer=window.setTimeout(delayFun,500);
            });

        },
        closeTipBox:function ($tipBox){
            var that=this;
            $tipBox.find(".close-ico").bind("click",function(event){
                $(this).parents("."+that.options.boxClass).hide().remove();
                window.clearTimeout(that.delaytimer);
                event.preventDefault();
            })
        },
        deflunt:{
            id:"",
            boxClass:"SODAO-tips",
            content:"",             //内容
            offset:0,               //效果开启,偏移量
            width:"",
            height:"",               //宽度
            title: null,            //title
            closeable: false,        //是否显示关闭
            callBack:null,     //关闭回调事件函数
            closeDelay: 0,          //自动隐藏的延迟时间
            direction:"top",         //tip相对于对象的方向
            directing:null,          //是否显示箭头
            zIndex:100,
            objevent:null,
            mouseOverDelay:false,
            actObj : this
        }
    };

    $.fn.tipBox=function(options){
        return this.each(function() {
            new $.tipBox(this, options);
        });
    }
})(jQuery);